 <template>
     <div class="section">
         <div class="swiper-container"
              ref="slider">
             <div class="swiper-wrapper">
                 <div class="swiper-slide">
                     <img src="./fixtures/covers/1.svg"/>
                 </div>
                 <div class="swiper-slide">
                     <img src="./fixtures/covers/3.svg"/>
                 </div>
                 <div v-for="s in slides" class="swiper-pagination">
                     <img :src="s.img_url"/>
                 </div>
             </div>
             <div class="swiper-pagination" ref="pagination" ></div>
         </div>
         <div class="annoucement">
             <label>快讯</label>
             <span>{{announcement}}</span>
         </div>
     </div>
 </template>

 <script type="text/ecmascript-6">
     import Swiper from "swiper"
     import 'swiper/dist/css/swiper.css'
     import "./list.less"
     export default{
         props:['announcement','slides']
         ,beforeMount(){
             console.log("slider beforeMount");
         }
         ,beforeCreate(){
             console.log("slider beforeCreate")
         }
         ,created(){
             console.log("slider created");
         },
         mounted(){
            window.setTimeout(function(){
                console.log("slider setTimeout");
                new Swiper('.swiper-container', {
                    pagination:'swiper-pagination',
                    paginationClickable:true,
                    spaceBetween:30,
                    centeredSlides:true,
                    autoplay:2500,
                    autoplayDisableOnInteraction:false
                })
            },1000);
             console.log("slider mounted");
         }
         }
 </script>